const classNames = require('classnames')
const _ = require('../utils')
const { listParentBehavior, listItemBehavior } = require('../behaviors')

_.create('button-group', {
  properties: {
    variant: { type: String },
    type: { type: String, value: 'primary' },
    size: { type: String, value: 'normal' },
  },

  behaviors: [listParentBehavior],

  computed: {
    classes(data) {
      const { classPrefix, variant } = data
      const classes = classNames(classPrefix, {
        [`${classPrefix}-raised`]: variant === 'raised',
      })

      return classes
    },
  },

  relations: {
    buttonItem: {
      type: 'child',
      target: listItemBehavior,
      linked: function () {
        this.assignElementSN('buttonItem')
      },
    },
  },

  methods: {
    onTap(e) {
      this.triggerEvent('tap', e.detail)
    },
  },

  lifetimes: {
    ready() {},
  },
})
